<template>
    <table class="table table-bordered text-center">
        <tbody>
            <tr>
                <td>id</td>
                <td>姓名</td>
                <td>图标</td>
                <td>说明</td>
                <td>图片</td>
                <td>操作</td>
                
            </tr>
            <tr v-for="item in HuiyuanList" :key="item.typeId">
                <td>{{item.id}}</td>
                <td>{{item.name}}</td>
                <td>{{item.tubiao}}</td>
                <td>{{item.shuoMing}}</td>
                <td>
                    <img v-if="item.tuPian" :src="item.tuPian" style="max-width: 100px; max-height: 100px;">
                </td>
                <td>操作</td>
            </tr>
        </tbody>
    </table>
</template>

<script setup lang="ts">
//引入组件
import { ref, reactive, onMounted } from "vue"
import "bootstrap/dist/css/bootstrap.min.css"
import axios from "axios";
import { isTemplateExpression } from "typescript";
/* //查询条件
const from = reactive({
    name: "",
    typeId: "0"
})
 */
//显示
const HuiyuanList = ref([]);


const GetShopShow = () => {
    axios.get("https://localhost:7209/api/Huiyuan/GetHuiyuans").then(res => {
        HuiyuanList.value = res.data;
    }).catch(err => {
        console.log(err);
    })
}

//勾子函数
onMounted(() => {
    GetShopShow();
})
</script>

<style></style>
